<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="Content-Language" content="zh-cn">
    <meta name="apple-mobile-web-app-capable" content="no"/>
    <meta name="apple-touch-fullscreen" content="yes"/>
    <meta name="format-detection" content="telephone=no,email=no"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="white">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <meta http-equiv="Expires" content="0">
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="Cache-control" content="no-cache">
    <meta http-equiv="Cache" content="no-cache">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title></title>
    <link href="__STATIC__/public/yunpay/css/style.css" rel="stylesheet" media="screen">
    <!--
	<script type="text/javascript" src="//cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script>
	<script src="//cdn.staticfile.org/jquery.qrcode/1.0/jquery.qrcode.min.js"></script>
	-->

	<script src="__STATIC__/public/yunpay/js/jquery3.3.1.min.js"></script>
  	<script src="__STATIC__/public/yunpay/js/jquery.qrcode1.0.min.js"></script>
  	<script src="__STATIC__/public/yunpay/js/moment2.22.2.min.js"></script>
</head>

<body>
<div class="body">
    <h1 class="mod-title">
        <span class='ico_log ico-{if condition="$data.istype==100"}3{elseif condition="$data.istype==120"/}5{else /}1{/if}'></span>
    </h1>
    {eq name="data.status" value="fail"}
        <div class="order">
        </div>
        <div style="margin:0 auto;text-align: center;">
            {$data.msg}
        </div>
    {else/}
    <div class="mod-ct">
        <div class="order">
        </div>
        <div class="amount" id="money">￥<?php echo round($data["realprice"],2); ?></div>
        <div class ="paybtn" style = "display: none;">
            <!-- <a href="<?php echo $data["qrcode"]; ?>" id="alipaybtn" class="btn btn-primary" target="_blank">启动支付宝App支付</a> -->
            <a href="#" id="alipaybtn" class="btn btn-primary">请打开支付宝“扫一扫”</a>
            <form action='<?php echo $data["qrcode"]; ?>' id="alipayform"></form>
        </div>
        <div class="qrcode-img-wrapper" data-role="qrPayImgWrapper">
            <div data-role="qrPayImg" class="qrcode-img-area">
                <div class="ui-loading qrcode-loading" data-role="qrPayImgLoading" style="display: none;"></div>
                <div style="position: relative;display: inline-block;">
                    <img  id="show_qrcode" src="https://www.kuaizhan.com/common/encode-png?large=true&data=<?php echo $data["qrcode"]; ?>" width="210" height="210" style="display: none;"/>

                    <img onclick="$('#use').hide()" id="use" src='__STATIC__/public/yunpay/images/logo_{if condition="$data.istype==100"}weixin{elseif condition="$data.istype==120"/}ysf{else /}alipay{/if}.png' style="position: absolute;top: 50%;left: 50%;width:32px;height:32px;margin-left: -16px;margin-top: -16px"/>

                    <div id="qrcode" style = "display: block;z-index:1000"></div>
                    <canvas id="imgCanvas" width="210" height="250" style = "display: none;"></canvas>

                </div>
            </div>

        </div>
        <div class ="payweixinbtn" style = "display: none;"><a href="https://www.kuaizhan.com/common/encode-png?large=true&data=<?php echo $data['qrcode']; ?>" target="_blank" download id="downloadbtn" class="btn btn-primary">1.先保存二维码到手机</a></div>
        <div class ="payweixinbtn" style = "display: none;padding-top: 10px"><a href="weixin://" class="btn btn-primary">2.打开微信，扫一扫本地图片</a></div>

        <div class ="iospayweixinbtn" style = "display: none;">1.长按上面的图片然后"存储图像"</div>
        <div class ="iospayweixinbtn" style = "display: none;padding-top: 10px"><a href="weixin://scanqrcode" class="btn btn-primary">2.打开微信，扫一扫本地图片</a></div>

        <div class="time-item" style = "padding-top: 10px">
            <div class="time-item" id="msg"><h1 style="color: red;">为了您及时到帐 请务必付款￥<?php echo round($data["realprice"],2); ?>元</h1> </div>
            <strong id="hour_show">0时</strong>
            <strong id="minute_show">0分</strong>
            <strong id="second_show">0秒</strong>
            <div class="time-item"><h1 id="msg_expired" style="color: red;"></h1> </div>
        </div>

        <div class="tip">
            <div class="ico-scan"></div>
            <div class="tip-text">
                <p id="showtext">打开{if condition="$data.istype==100"}微信{elseif condition="$data.istype==120"/}云闪付{else /}支付宝{/if} [扫一扫]</p>
            </div>
        </div>



        <div class="tip-text">
        </div>


    </div>
    <div class="foot">
        <div class="inner" style="display:none;">
            <p>手机用户可保存上方二维码到手机中</p>
            <p>在 {if condition="$data.istype==100"}微信{elseif condition="$data.istype==120"/}云闪付{else /}支付宝{/if} 扫一扫中选择“相册”即可</p>
            <p></p>
        </div>
    </div>

    {/eq}
</div>


<script type="text/javascript">
    var priceIstype ='1';

    var myTimer;
    var strcode = '<?php echo $data["qrcode"]; ?>';

    function timer(intDiff) {
        myTimer = window.setInterval(function () {
            var day = 0,
                hour = 0,
                minute = 0,
                second = 0;//时间默认值
            if (intDiff > 0) {
                day = Math.floor(intDiff / (60 * 60 * 24));
                hour = Math.floor(intDiff / (60 * 60)) - (day * 24);
                minute = Math.floor(intDiff / 60) - (day * 24 * 60) - (hour * 60);
                second = Math.floor(intDiff) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
            }
            if (minute <= 9) minute = '0' + minute;
            if (second <= 9) second = '0' + second;
            $('#hour_show').html('<s id="h"></s>' + hour + '时');
            $('#minute_show').html('<s></s>' + minute + '分');
            $('#second_show').html('<s></s>' + second + '秒');
            if (hour <= 0 && minute <= 0 && second <= 0) {
                qrcode_timeout();
                clearInterval(myTimer);
            }
            intDiff--;

            if (strcode != ""){
                checkdata();
            }

        }, 2000);
    }

    function checkdata(){
        //return ;
        $.post(
            "/index/user/check_yun",
            {
                orderid : "<?php echo $data["orderid"]; ?>",
            },
            function(data){
                if (data == 1){
                    window.clearInterval(myTimer);
                  	$('#qrcode').hide();
                    $("#show_qrcode").attr("src","__STATIC__/public/yunpay/images/pay_ok.png").show();
                    $("#use").remove();
                    $("#money").text("支付成功");
                    $("#msg").html("<h1>即将返回商家页</h1>");
                    if (isMobile() == 1){
                        $(".paybtn").html('<a href="/" class="btn btn-primary">返回商家页</a>');
                        setTimeout(function(){
                            location.replace("/index/user/index")
                        }, 3000);
                    }else{
                        $("#msg").html("<h1>即将跳转回商家页</h1>");
                        setTimeout(function(){
                            location.replace("/index/user/index")
                        }, 3000);
                    }

                }
            }
        );
    }

    function qrcode_timeout(){
      	$('#qrcode').hide();
        $('#show_qrcode').attr("src","__STATIC__/public/yunpay/images/qrcode_timeout.png").show();

        $("#use").hide();
        $("#msg").html("<h1> 支付超时，即将跳转回商家页</h1>");
        setTimeout(function(){
            location.replace("index/user/index")
        }, 3000);
    }

    function isWeixin() {
        var ua = window.navigator.userAgent.toLowerCase();
        if (ua.match(/MicroMessenger/i) == 'micromessenger') {
            return 1;
        } else {
            return 0;
        }
    }

    function isMobile() {
        var ua = navigator.userAgent.toLowerCase();
        _long_matches = 'googlebot-mobile|android|avantgo|blackberry|blazer|elaine|hiptop|ip(hone|od)|kindle|midp|mmp|mobile|o2|opera mini|palm( os)?|pda|plucker|pocket|psp|smartphone|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce; (iemobile|ppc)|xiino|maemo|fennec';
        _long_matches = new RegExp(_long_matches);
        _short_matches = '1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|e\-|e\/|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(di|rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|xda(\-|2|g)|yas\-|your|zeto|zte\-';
        _short_matches = new RegExp(_short_matches);
        if (_long_matches.test(ua)) {
            return 1;
        }
        user_agent = ua.substring(0, 4);
        if (_short_matches.test(user_agent)) {
            return 1;
        }
        return 0;
    }


    $().ready(function(){

        //默认240秒过期

        //timer("290");//300-10
      	//timer("<?php echo $data['expired_at']-time()-30; ?>");
      	var jsnow=Date.parse(new Date())/1000;
        timer(<?php echo $data['expired_at'] ?>-jsnow-30);

        var istype={if condition="$data.istype==100"}2{elseif condition="$data.istype==120"/}3 {else /}1{/if};
        var suremoney = "1";
        var uaa = navigator.userAgent;
        var isiOS = !!uaa.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
        if (isMobile() == 1){
            if (isWeixin() == 1 && istype == 2){
                //微信内置浏览器+微信支付
                $("#showtext").text("长按二维码识别");
            } else{
                //其他手机浏览器+支付宝支付
                if (isWeixin() == 0 && istype == 1){
                    $(".paybtn").attr('style','');
                    // if(priceIstype=="2"&&!isiOS){
                    //     $('#alipayform').submit();
                    // }
                    //$('#msg').html("<h1>支付完成后，请返回此页</h1>");
                    //$(".qrcode-img-wrapper").remove();
                    $(".tip").remove();
                    $(".foot").remove();

                    $('#qrcode').qrcode({
                        text: '<?php echo $data["qrcode"]; ?>',
                        width: 200,
                        height: 200,
                    });
                    //$(location).attr('href', '<?php echo $data["qrcode"]; ?>');
                }else if (isWeixin() == 0 && istype == 3){
                    $(".paybtn").attr('style','');
                    // if(priceIstype=="2"&&!isiOS){
                    //     $('#alipayform').submit();
                    // }
                    //$('#msg').html("<h1>支付完成后，请返回此页</h1>");
                    //$(".qrcode-img-wrapper").remove();
                    $("#alipaybtn").text('请打开云闪付扫一扫');
                    $(".tip").remove();
                    $(".foot").remove();

                    $('#qrcode').qrcode({
                        text: '<?php echo $data["qrcode"]; ?>',
                        width: 200,
                        height: 200,
                    });
                    //$(location).attr('href', '<?php echo $data["qrcode"]; ?>');
                } else {
                    if (isWeixin() == 0 && istype == 2){
                        //其他手机浏览器+微信支付
                        //IOS的排除掉
                        if (isiOS){
                            var qrcode = $('#qrcode').qrcode({
                                text: '<?php echo $data["qrcode"]; ?>',
                                width: 200,
                                height: 200,
                            });//.hide();
                            //添加文字
                            var text = "长按下载";//设置文字内容
                            var canvas = qrcode.find('canvas').get(0);
                            var oldCtx = canvas.getContext('2d');
                            var imgCanvas = document.getElementById('imgCanvas');
                            var ctx = imgCanvas.getContext('2d');
                            ctx.fillStyle = 'white';
                            ctx.fillRect(0,0,210,250);
                            ctx.putImageData(oldCtx.getImageData(0, 0, 200, 210), 5, 20);
                            ctx.fillStyle = 'black';
                            ctx.strokStyle = 'rgb(1,1,0)';
                            //ctx.stroke = 3;
                            ctx.textBaseline = 'middle';
                            ctx.textAlign = 'center';
                            ctx.font = '15px';
                            ctx.fillText(text, imgCanvas.width / 2, 240 );
                            ctx.strokeText(text, imgCanvas.width / 2, 240);
                            imgCanvas.style.display = 'none';
                            $('#show_qrcode').attr('src', imgCanvas.toDataURL('image/png')).css({
                                width: 210,height:250
                            });
                            $('.iospayweixinbtn').attr('style','padding-top: 15px;');
                        }else{
                            $(".payweixinbtn").attr('style','padding-top: 15px;');
							$('#qrcode').qrcode({
								text: '<?php echo $data["qrcode"]; ?>',
								width: 200,
								height: 200,
							});
                        }

                        $("#showtext").html("请保存二维码到手机<br>微信扫一扫点右上角-从相册选取");
                    }
                }
            }


            $('#msg_expired').text("此码仅有效一次 至 "+moment(<?php echo $data["expired_at"]*1000; ?>).format('YYYY-MM-DD HH:mm:ss'));
        }

    });


</script>
</body>
</html>
